import { Todo } from '@/types';
import { ref, computed, Ref } from 'vue';

export default function useFilteredTodos(todos: Ref<Todo[]>) {
  const filter = ref('all');

  const filteredTodos = computed(() => {
    switch (filter.value) {
      case 'done':
        return todos.value.filter((todo: Todo) => todo.completed);

      case 'todo':
        return todos.value.filter((todo: Todo) => !todo.completed);

      default:
        return todos.value;
    }
  });

  return {
    filter,
    filteredTodos,
  };
}
